import { BasicColumn, FormSchema } from '@/components/Table';
import { Tinymce } from '@/components/Tinymce';
import { h } from 'vue';

export const ColumnPage: BasicColumn[] = [
  {
    title: '帮助标题',
    dataIndex: 'title',
  },
  {
    title: '路由标识',
    dataIndex: 'type',
  },
  {
    title: '所属分类',
    dataIndex: 'cateName',
  },
  {
    title: '排序',
    dataIndex: 'orderNo',
  },
  {
    title: '更新时间',
    dataIndex: 'updateTime',
    width: 150,
    fixed: 'right',
    sorter: true,
    customRender: ({ record }) => {
      return record.updateTime?.substring(0, 16);
    },
  },
];

export const SearchForm: FormSchema[] = [
  {
    field: 'title',
    label: '帮助标题',
    component: 'Input',
    colProps: { span: 8 },
  },
];

export const FormSchemaAdd: FormSchema[] = [
  {
    field: 'title',
    label: '标题',
    component: 'Input',
    required: true,
    colProps: { span: 12 },
  },
  {
    field: 'cateId',
    label: '所属分类',
    component: 'Select',
    componentProps: {
      options: [
        {
          value: 1,
          label: '公司简介',
        },
        {
          value: 2,
          label: '帮助中心',
        },
      ],
    },
    required: true,
    colProps: { span: 12 },
  },
  {
    label: '内容',
    field: 'content',
    component: 'Input',
    render: ({ model, field }) => {
      return h(Tinymce, {
        value: model[field],
        onChange: (value: string) => {
          model[field] = value;
        },
      });
    },
  },
  {
    label: '路由标识',
    field: 'type',
    helpMessage: '用于路由链接',
    component: 'Input',
    required: true,
    colProps: { span: 12 },
  },
  {
    label: '排序',
    field: 'orderNo',
    component: 'InputNumber',
    defaultValue: 0,
    colProps: { span: 12 },
  },
];
